/*
 * @Description:
 * @Version: 1.0
 * @Autor: younghxp
 * @Date: 2022-05-16 17:43:47
 * @LastEditors: younghxp
 * @LastEditTime: 2022-05-16 17:51:12
 */
export default {
  data() {
    return {
      hiddleToolBar: false,
      tableHeight: null,
      mainConHeight: '',
    }
  },
  mounted() {
    let that = this
    window.addEventListener('scroll', this.handleScroll, true)
    //监听f12按键
    document.onkeydown = function (e) {
      if (e.key == 'F12') {
        that.$nextTick(function () {
          that.$refs.tableBox1 && that.$refs.tableBox1.doLayout()
        })
      }
    }

    this.$nextTick(function () {
      let tableHeightCur = this.$refs.tableBox1.$el.clientHeight
      let tableTop = this.$refs.tableBox.getBoundingClientRect().top
      if (tableHeightCur + tableTop > window.innerHeight) {
        this.tableHeight =
          this.$refs.mainCon.getBoundingClientRect().height - 86
      } else {
        document.getElementsByClassName('tableBoxCur').length &&
          (document.getElementsByClassName('tableBoxCur')[0].style.height =
            window.innerHeight - tableTop - 40 + 'px')
      }

      window.onresize = function () {
        if (!that.$refs.tableBox1) {
          return
        }
        let tableHeightCur = that.$refs.tableBox1.$el.clientHeight
        let tableTop = that.$refs.tableBox.getBoundingClientRect().top
        if (tableHeightCur + tableTop > window.innerHeight) {
          that.tableHeight =
            that.$refs.mainCon.getBoundingClientRect().height - 86
        } else {
          document.getElementsByClassName('tableBoxCur').length &&
            (document.getElementsByClassName('tableBoxCur')[0].style.height =
              window.innerHeight - tableTop - 40 + 'px')
        }
        that.$refs.tableBox1 && that.$refs.tableBox1.doLayout()
      }
    })
  },
  methods: {
    handleScroll(e) {
      this.$nextTick(function () {
        //变量scrollTop是滚动条滚动时，距离顶部的距离
        var scrollTop = e.target.scrollTop
        if (!this.mainConHeight) {
          this.mainConHeight = this.$refs.mainCon.getBoundingClientRect().height
        }

        if (
          this.$refs.tableBox &&
          this.$refs.tableBox.getBoundingClientRect().top < 128
        ) {
          // this.tableHeight = this.$refs.mainCon.getBoundingClientRect().height - 84
          this.tableHeight = this.mainConHeight - 94
          // 搜索栏高度60 + 内边距24 + spaceing 10
          if (document.getElementsByClassName('tableBoxCur').length) {
            document.getElementsByClassName('tableBoxCur')[0].style.height =
              null
          }
          this.hiddleToolBar = true
        } else {
          this.hiddleToolBar = false
        }
      })
    },
  },
  activated() {
    window.addEventListener('scroll', this.handleScroll, true)
    this.$nextTick(function () {
      this.$refs.tableBox1.doLayout()
    })
  },
  deactivated() {
    let that = this
    window.removeEventListener('scroll', that.handleScroll, true)
  },
  beforeDestroy() {
    let that = this
    window.removeEventListener('scroll', that.handleScroll, true)
  },
}
